<!--  -->
<template>
  <div>keepalive

  <KeepAlive :exclude="['AliveCom2']">
   <component :is="com[current]"></component>
</KeepAlive>
<el-radio-group v-model="current" size="large">
      <el-radio-button label="AliveCom1" value="AliveCom1" />
      <el-radio-button label="AliveCom2" value="AliveCom2" />
      <el-radio-button label="AliveCom3" value="AliveCom3" />
    </el-radio-group>
  </div>
</template>
<script lang='ts' setup>
import { reactive,toRefs,ref,onMounted} from 'vue'
import AliveCom1 from './AliveCom1.vue';
import AliveCom2 from './AliveCom2.vue';
import AliveCom3 from './AliveCom3.vue';
const current = ref('AliveCom1');

const com = reactive<Record<string,any>>({
  AliveCom1:AliveCom1,
  AliveCom2:AliveCom2,
  AliveCom3:AliveCom3
})

const checkout=()=>{
    current.value=current.value==='AliveCom1'?'AliveCom2':'AliveCom1';
}



</script>
<style scoped>
</style>